<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:include="shared/css_js::header">
	<title>jQuery WeUI</title>
	<link rel="stylesheet" type="text/css" href="/static/css/weuicss/weui.min.css"/>
</head>
<body>

<!--底部-->
<nav th:replace="shared/foot :: foot" class="mui-bar mui-bar-tab">
</nav>
<header class="mui-bar mui-bar-nav">
	<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
	<h1 class="mui-title"><font size="4"><b>我的会员卡</b></font></h1>
</header>

<div class="mui-content mui-slider">
	<div id="sliderSegmentedControl" class="mui-slider-indicator mui-segmented-control mui-segmented-control-inverted">
		<a class="mui-control-item" href="#tc">套餐计次卡</a>
		<a class="mui-control-item" href="#mouldprepay">储值卡</a>
	</div>
	<div id="sliderProgressBar" class="mui-slider-progress-bar mui-col-xs-6"></div>
	<div class="mui-slider-group">
		<!--套餐计次卡-->
		<div id="tc"   class="mui-slider-item mui-control-content ">
			<ul class="mui-table-view" th:if="${list.size()>0}" >
				<li class="mui-table-view-cell mui-media" >
					<a th:each="mouldtc:${list}" th:onclick="'javascript:custcarddetail(\''+${mouldtc.cardid}+'\')'"  style="background-color: cadetblue;margin: 7px;border-radius:10px;">
						<p class="mui-pull-right" style="color: white" th:text="${mouldtc.chnname}">车享家汽车美容</p>
						<h3  style="color: white;line-height: 4;margin-left: 70px" align="center" th:text="${mouldtc.tcname}">保养套餐ABC</h3>
						<p style="color: white">卡号:<span th:text="${mouldtc.cardno}">14454654541221</span></p>
						<p style="color: white">有效期:<span th:text="${mouldtc.expidate}">2017-10-22</span></p>
					</a>
				</li>
			</ul>
			<div th:if="${list.size()>0}" class="weui-cells__title"></div><!--间隔一下-->
		</div>
		<!--储值卡-->
		<div id="mouldprepay"   class="mui-slider-item mui-control-content ">
			<ul class="mui-table-view" th:if="${list2.size()>0}">
				<li class="mui-table-view-cell mui-media" >
					<a th:each="mouldprepay:${list2}" th:onclick="'javascript:mouldprepaydetail(\''+${mouldprepay.cardid}+'\')'"  style="background-color: olivedrab;margin: 7px;border-radius:10px;">
						<p class="mui-pull-right" style="color: white" th:text="${mouldprepay.chnname}">车享家汽车美容</p>
						<h3  style="color: white;line-height: 4;margin-left: 70px" align="center" th:text="${mouldprepay.tcname}">保养套餐ABC</h3>
						<p style="color: white">卡号:<span th:text="${mouldprepay.cardno}">14454654541221</span></p>
						<p style="color: white">有效期:<span th:text="${mouldprepay.expidate}">2017-10-22</span></p>
					</a>
				</li>
			</ul>
			<div th:if="${list2.size()>0}" class="weui-cells__title"></div><!--间隔一下-->
		</div>
	</div>

	<div class="weui-cells__title" align="center">没有再多内容啦</div><!--没有再多内容啦-->
</div>

</body>
<script>

/*套餐计次卡详情*/
function custcarddetail(cardid) {
	location.href="/custcard/custcarddetail?cardid="+cardid;
}

/*储值卡详情*/
function mouldprepaydetail(cardid) {
    location.href="/custcard/mouldprepaydetail?cardid="+cardid;
}
</script>
</html>
